<template lang="pug">
	.finish-card-wrap
		.top-tip
			top-tip(tip="请认真填写身份证号，信息提交后无法修改")
		.card-input-container
			input-line(leftText='姓名' type="text" :disabled='true' ref="nameInput")
			input-line(leftText='出生证明' type="number" :disabled='true' ref="birthInput" :showBorder="false")
		.card-input-container
			input-line(leftText='身份证号' placeholder="请输入身份证号码" type="idcard" @getValue="getIdNumber" maxlength="18" :showBorder="false")
		.card-btn(@click="jumpToNext")
			main-button(text="确认提交" :isActive="nextStepPass")
</template>

<script>
import inputLine from '@/components/input-line'
import mainButton from '@/components/main-button'
import topTip from '@/components/top-tip'
export default {
	name: 'finishId',
	data() {
		return {
			idNumber: '',
			nextStepPassIdNumber: false
		}
	},
	computed: {
		nextStepPass() {
			return this.nextStepPassIdNumber
		}
	},
	created() {},
	mounted() {
		this.$refs.nameInput.inputtext = '李光耀'
		this.$refs.birthInput.inputtext = '3310**********9766'
	},
	methods: {
		jumpToNext() {
			if (this.nextStepPass) {
				this.submit()
			}
		},
		getIdNumber(text) {
			text = text.toString()
			this.idNumber = text
			if (text.length === 15 || text.length === 18) {
				this.nextStepPassIdNumber = this.tools.identityCodeValid(text)
			} else {
				this.nextStepPassIdNumber = false
			}
		},
		submit() {}
	},
	components: {
		topTip,
		inputLine,
		mainButton
	}
}
</script>

<style lang="stylus">
	.finish-card-wrap
		.top-tip
			padding mainPadding
		.card-input-container
			margin-bottom mainMargin
			background-color white
			.input-line-wrap
				margin 0
				padding 0 40px
		.card-btn
			width 690px
			height 92px
			margin 60px auto 0
			border-radius 46px
			overflow hidden
</style>
